<template>
  <div class="cartlist">
    <div class="cartlist-top">
      <van-icon name="arrow-left" size="0.5rem" color="#aaa" @click="backbefore" />
      <div class="carttop">我的购物车</div>
    </div>
    <div class="cartlistMain">
      <van-swipe-cell v-for="(item,index) in cartlist" :key="item.id">
        <van-card
          :price="item.proPrice+'.00'"
          :desc="item.displayName"
          :title="item.proSeries"
          class="goods-card"
          :thumb="item.listImgs[0].listImgpath"
        >
        </van-card>       
          <van-stepper v-model="item.numb" min="1" :max="100" />
       
          <van-checkbox
            v-model="item.ischecked"
            shape="square"
            icon-size="15px"
            checked-color="#000"
          ></van-checkbox>
        <template #right>
          <van-button square text="删除" type="danger" class="delete-button"  @click="delcartlist(index)"/>
        </template>
      </van-swipe-cell>      
    </div>
    <div class="cartlist-bottom">
      <van-submit-bar
        :price="allRes.allprice"
        button-text="提交订单"
        submit-bar-height="55px"
        @submit="handlecart"
      >
        <van-checkbox
          v-model="allRes.allchecked"
          shape="square"
          icon-size="15px"
          checked-color="#000"
          @click="allcheckbox(allRes.allchecked)"
          >全选</van-checkbox
        >
      </van-submit-bar>
    </div>
  </div>
</template>

<script>
import { mapGetters, mapState } from "vuex";
export default {
  computed: {
    ...mapState({
      cartlist: (state) => state.cartlist.cartList,
    }),
    ...mapGetters({
      allRes: "cartlist/allRes",
    }),
  },
  methods: {
    allcheckbox(bool) {
      console.log(bool);
      this.$store.commit("cartlist/allcheckedmut", bool);
    },
    delcartlist(index){
      this.$store.commit("cartlist/delcartmut",index)
    },
    handlecart(){
      this.$router.push("/payCart")
    },
    backbefore(){
      history.go(-1)
    }
  },
};
</script>

<style lang="less" scoped>
@import url("../assets/css/cart.css");
</style>
